<template>
  <div class="jifen">
    <header>
      <div class="left"><a></a></div>
      <div class="center">{{msg}}</div>  
      <div class="right"><a><img src="../assets/img/m31.png" ></a></div>
    </header>
    <main>
      <div class="banner">
        <img src="../assets/img/m31.png" alt="">
      </div>
    </main>
  </div>

</template>

<script>
export default {
  name: 'hello',
  data () {
    return {
      msg: '首页'
    }
  },
  methods: {
    danji () {
      this.$router.go(-1)
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang='less'>
@import '../assets/css/reset.css';
@import '../assets/css/index.less';
header{
  position: fixed;
  top: 0;
  width: 100%;
  .height(140);
  .font-size(40);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #28a85b;
  color:#ffffff;
  .left,.right{
      .width(160) ;
  }
  .center{
      flex: 1;
      text-align: center;
  }
  .right{
    a{.padding(0,0,0,50);
      display: block;
      img{
        .height(40);
        
        display: block;
      }
    }
  }
}
main{

}

</style>
